<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>饿了么</title>
    <link rel="stylesheet" href="iconfont/iconfont.css">
    <link rel="stylesheet" href="css/index.css">
    <script src="js/rem.js"></script>
</head>

<body>
    <div class="elm">
        <header>
            <div class="header_top">
                <i class="iconfont iconweizhi"></i>
                <span>慧通产业园B9栋</span>
                <i class="iconfont iconsanjiaoxia
                "></i>
            </div>
            <div class="header_bottom">
                <i class="iconfont iconsousuo"></i>
                <input type="text" value="搜索饿了么商家、商品名称">
            </div>
        </header>
        <main>
            <div class="wrap">
                <!-- 导航 -->
                <ul class="nav">
                    <li>
                        <img src="images/icon1.webp" alt="">
                        <span>美食</span>
                    </li>
                    <li>
                        <img src="images/icon2.webp" alt="">
                        <span>晚餐</span>
                    </li>
                    <li>
                        <img src="images/icon4.webp" alt="">
                        <span>商超便利</span>
                    </li>
                    <li>
                        <img src="images/icon5.webp" alt="">
                        <span>水果</span>
                    </li>
                    <li>
                        <img src="images/icon3.webp" alt="">
                        <span>医药健康</span>
                    </li>
                    <li>
                        <img src="images/icon6.webp" alt="">
                        <span>浪漫鲜花</span>
                    </li>
                    <li>
                        <img src="images/icon7.webp" alt="">
                        <span>跑腿代购</span>
                    </li>
                    <li>
                        <img src="images/icon8.webp" alt="">
                        <span>汉堡披萨</span>
                    </li>
                    <li>
                        <img src="images/icon9.webp" alt="">
                        <span>厨房生鲜</span>
                    </li>
                    <li>
                        <img src="images/icon10.webp" alt="">
                        <span>炸鸡</span>
                    </li>
                </ul>
                <!-- 广告 -->
                <div class="ad">
                    <div class="ad_left">
                        <h3>品质套餐</h3>
                        <p>搭配齐全吃得好</p>
                        <span>立即抢购 &gt;</span>
                    </div>
                    <div class="ad_right"><img src="images/list1.webp" alt=""></div>
                </div>
                <!-- 会员 -->
                <div class="vip">
                    <div class="vip_left">
                        <i class="iconfont iconhuangguan21
                    "></i>
                        <span>超级会员 · </span>
                        <p>&nbsp;每月领20元红包</p>
                    </div>
                    <div class="vip_right">
                        <span>立即开通 ></span>
                    </div>
                </div>
                <!-- 红包 -->
                <div class="hongbao">
                    <div class="hongbao_left">
                        <h2>饿了么超级会员免费领</h2>
                        <div class="free">
                            <span>免费兑4个商户红包</span>
                        </div>
                    </div>
                    <div class="hongbao_right"><img src="images/资质证照.png" alt=""></div>
                </div>
                <!-- 推荐商家 -->
                <div class="recommend">
                    <div class="business">
                        <h2><span>——</span> 推荐商家 <span>——</span></h2>
                    </div>
                    <ul class="classification">
                        <li><span>综合排序</span><i class="iconfont iconsanjiaoxia
                        "></i></li>
                        <li><span>距离最近</span><i></i></li>
                        <li><span>品质联盟</span><i></i></li>
                        <li><span>筛选</span><i class="iconfont iconshaixuan
                        "></i></li>
                    </ul>
                    <!-- 内容 -->
                    <div class="content">
                        <div class="products">
                            <div class="products_left">
                                <div class="products_img"><img src="images/汉堡王.png" alt=""></div>
                            </div>
                            <div class="products_right">
                                <div class="brands">
                                    <span>品牌 </span>
                                    <h2>汉堡王(广州元京路餐厅263...</h2>
                                    <i class="iconfont iconshenglvehao1
                                    "></i>
                                </div>
                                <div class="evaluation">
                                    <div class="evaluation_left">
                                        <span></span>
                                        <i>4.6</i>
                                        <i>月售2698单</i>
                                    </div>
                                    <div class="evaluation_right">
                                        <span>蜂鸟配送</span>
                                    </div>
                                </div>
                                <div class="distribution">
                                    <div class="distribution_left">
                                        <span>￥20起送 </span>
                                        <span> 配送费￥4</span>
                                    </div>
                                    <div class="distribution_right">
                                        <span>751m</span>
                                        <span>30分钟</span>
                                    </div>
                                </div>
                                <div class="quality">
                                    <span>汉堡薯条</span>
                                    <span>品质联盟</span>
                                </div>
                                <div class="less">
                                    <div class="less_left">
                                        <span>减</span>
                                        <p>满55减10，满79减25</p>
                                    </div>
                                    <div class="less_right">
                                        <span>4个活动</span>
                                        <i class="iconfont iconsanjiaoxia
                                        "></i>
                                    </div>
                                </div>
                                <div class="change">
                                    <span>换</span>
                                    <p>特价商品5.9元起</p>
                                </div>

                            </div>
                        </div>
                        <div class="products">
                            <div class="products_left">
                                <div class="products_img"><img src="images/汉堡王.png" alt=""></div>
                            </div>
                            <div class="products_right">
                                <div class="brands">
                                    <span>品牌 </span>
                                    <h2>汉堡王(广州元京路餐厅263...</h2>
                                    <i class="iconfont iconshenglvehao1
                                    "></i>
                                </div>
                                <div class="evaluation">
                                    <div class="evaluation_left">
                                        <span></span>
                                        <i>4.6</i>
                                        <i>月售2698单</i>
                                    </div>
                                    <div class="evaluation_right">
                                        <span>蜂鸟配送</span>
                                    </div>
                                </div>
                                <div class="distribution">
                                    <div class="distribution_left">
                                        <span>￥20起送 </span>
                                        <span> 配送费￥4</span>
                                    </div>
                                    <div class="distribution_right">
                                        <span>751m</span>
                                        <span>30分钟</span>
                                    </div>
                                </div>
                                <div class="quality">
                                    <span>汉堡薯条</span>
                                    <span>品质联盟</span>
                                </div>
                                <div class="less">
                                    <div class="less_left">
                                        <span>减</span>
                                        <p>满55减10，满79减25</p>
                                    </div>
                                    <div class="less_right">
                                        <span>4个活动</span>
                                        <i class="iconfont iconsanjiaoxia
                                        "></i>
                                    </div>
                                </div>
                                <div class="change">
                                    <span>换</span>
                                    <p>特价商品5.9元起</p>
                                </div>

                            </div>
                        </div>
                        <div class="products">
                            <div class="products_left">
                                <div class="products_img"><img src="images/汉堡王.png" alt=""></div>
                            </div>
                            <div class="products_right">
                                <div class="brands">
                                    <span>品牌 </span>
                                    <h2>汉堡王(广州元京路餐厅263...</h2>
                                    <i class="iconfont iconshenglvehao1
                                    "></i>
                                </div>
                                <div class="evaluation">
                                    <div class="evaluation_left">
                                        <span></span>
                                        <i>4.6</i>
                                        <i>月售2698单</i>
                                    </div>
                                    <div class="evaluation_right">
                                        <span>蜂鸟配送</span>
                                    </div>
                                </div>
                                <div class="distribution">
                                    <div class="distribution_left">
                                        <span>￥20起送 </span>
                                        <span> 配送费￥4</span>
                                    </div>
                                    <div class="distribution_right">
                                        <span>751m</span>
                                        <span>30分钟</span>
                                    </div>
                                </div>
                                <div class="quality">
                                    <span>汉堡薯条</span>
                                    <span>品质联盟</span>
                                </div>
                                <div class="less">
                                    <div class="less_left">
                                        <span>减</span>
                                        <p>满55减10，满79减25</p>
                                    </div>
                                    <div class="less_right">
                                        <span>4个活动</span>
                                        <i class="iconfont iconsanjiaoxia
                                        "></i>
                                    </div>
                                </div>
                                <div class="change">
                                    <span>换</span>
                                    <p>特价商品5.9元起</p>
                                </div>

                            </div>
                        </div>
                        <div class="products">
                            <div class="products_left">
                                <div class="products_img"><img src="images/汉堡王.png" alt=""></div>
                            </div>
                            <div class="products_right">
                                <div class="brands">
                                    <span>品牌 </span>
                                    <h2>汉堡王(广州元京路餐厅263...</h2>
                                    <i class="iconfont iconshenglvehao1
                                    "></i>
                                </div>
                                <div class="evaluation">
                                    <div class="evaluation_left">
                                        <span></span>
                                        <i>4.6</i>
                                        <i>月售2698单</i>
                                    </div>
                                    <div class="evaluation_right">
                                        <span>蜂鸟配送</span>
                                    </div>
                                </div>
                                <div class="distribution">
                                    <div class="distribution_left">
                                        <span>￥20起送 </span>
                                        <span> 配送费￥4</span>
                                    </div>
                                    <div class="distribution_right">
                                        <span>751m</span>
                                        <span>30分钟</span>
                                    </div>
                                </div>
                                <div class="quality">
                                    <span>汉堡薯条</span>
                                    <span>品质联盟</span>
                                </div>
                                <div class="less">
                                    <div class="less_left">
                                        <span>减</span>
                                        <p>满55减10，满79减25</p>
                                    </div>
                                    <div class="less_right">
                                        <span>4个活动</span>
                                        <i class="iconfont iconsanjiaoxia
                                        "></i>
                                    </div>
                                </div>
                                <div class="change">
                                    <span>换</span>
                                    <p>特价商品5.9元起</p>
                                </div>

                            </div>
                        </div>
                        <div class="products">
                            <div class="products_left">
                                <div class="products_img"><img src="images/汉堡王.png" alt=""></div>
                            </div>
                            <div class="products_right">
                                <div class="brands">
                                    <span>品牌 </span>
                                    <h2>汉堡王(广州元京路餐厅263...</h2>
                                    <i class="iconfont iconshenglvehao1
                                    "></i>
                                </div>
                                <div class="evaluation">
                                    <div class="evaluation_left">
                                        <span></span>
                                        <i>4.6</i>
                                        <i>月售2698单</i>
                                    </div>
                                    <div class="evaluation_right">
                                        <span>蜂鸟配送</span>
                                    </div>
                                </div>
                                <div class="distribution">
                                    <div class="distribution_left">
                                        <span>￥20起送 </span>
                                        <span> 配送费￥4</span>
                                    </div>
                                    <div class="distribution_right">
                                        <span>751m</span>
                                        <span>30分钟</span>
                                    </div>
                                </div>
                                <div class="quality">
                                    <span>汉堡薯条</span>
                                    <span>品质联盟</span>
                                </div>
                                <div class="less">
                                    <div class="less_left">
                                        <span>减</span>
                                        <p>满55减10，满79减25</p>
                                    </div>
                                    <div class="less_right">
                                        <span>4个活动</span>
                                        <i class="iconfont iconsanjiaoxia
                                        "></i>
                                    </div>
                                </div>
                                <div class="change">
                                    <span>换</span>
                                    <p>特价商品5.9元起</p>
                                </div>

                            </div>
                        </div>
                        <div class="products">
                            <div class="products_left">
                                <div class="products_img"><img src="images/汉堡王.png" alt=""></div>
                            </div>
                            <div class="products_right">
                                <div class="brands">
                                    <span>品牌 </span>
                                    <h2>汉堡王(广州元京路餐厅263...</h2>
                                    <i class="iconfont iconshenglvehao1
                                    "></i>
                                </div>
                                <div class="evaluation">
                                    <div class="evaluation_left">
                                        <span></span>
                                        <i>4.6</i>
                                        <i>月售2698单</i>
                                    </div>
                                    <div class="evaluation_right">
                                        <span>蜂鸟配送</span>
                                    </div>
                                </div>
                                <div class="distribution">
                                    <div class="distribution_left">
                                        <span>￥20起送 </span>
                                        <span> 配送费￥4</span>
                                    </div>
                                    <div class="distribution_right">
                                        <span>751m</span>
                                        <span>30分钟</span>
                                    </div>
                                </div>
                                <div class="quality">
                                    <span>汉堡薯条</span>
                                    <span>品质联盟</span>
                                </div>
                                <div class="less">
                                    <div class="less_left">
                                        <span>减</span>
                                        <p>满55减10，满79减25</p>
                                    </div>
                                    <div class="less_right">
                                        <span>4个活动</span>
                                        <i class="iconfont iconsanjiaoxia
                                        "></i>
                                    </div>
                                </div>
                                <div class="change">
                                    <span>换</span>
                                    <p>特价商品5.9元起</p>
                                </div>

                            </div>
                        </div>
                        <div class="products">
                            <div class="products_left">
                                <div class="products_img"><img src="images/汉堡王.png" alt=""></div>
                            </div>
                            <div class="products_right">
                                <div class="brands">
                                    <span>品牌 </span>
                                    <h2>汉堡王(广州元京路餐厅263...</h2>
                                    <i class="iconfont iconshenglvehao1
                                    "></i>
                                </div>
                                <div class="evaluation">
                                    <div class="evaluation_left">
                                        <span></span>
                                        <i>4.6</i>
                                        <i>月售2698单</i>
                                    </div>
                                    <div class="evaluation_right">
                                        <span>蜂鸟配送</span>
                                    </div>
                                </div>
                                <div class="distribution">
                                    <div class="distribution_left">
                                        <span>￥20起送 </span>
                                        <span> 配送费￥4</span>
                                    </div>
                                    <div class="distribution_right">
                                        <span>751m</span>
                                        <span>30分钟</span>
                                    </div>
                                </div>
                                <div class="quality">
                                    <span>汉堡薯条</span>
                                    <span>品质联盟</span>
                                </div>
                                <div class="less">
                                    <div class="less_left">
                                        <span>减</span>
                                        <p>满55减10，满79减25</p>
                                    </div>
                                    <div class="less_right">
                                        <span>4个活动</span>
                                        <i class="iconfont iconsanjiaoxia
                                        "></i>
                                    </div>
                                </div>
                                <div class="change">
                                    <span>换</span>
                                    <p>特价商品5.9元起</p>
                                </div>

                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </main>
        <footer>
            <ul class="icon">
                <li><i class="iconfont iconchangyonglogo40"></i><span>首页</span></li>
                <li><i class="iconfont iconfaxian"></i><span>发现</span></li>
                <li><i class="iconfont icondingdan"></i><span>订单</span></li>
                <li><i class="iconfont iconweibiaoti2fuzhi12
                    "></i><span>我的</span></li>
            </ul>
        </footer>
    </div>

</body>

</html>